<template>
    <el-container>
       <nav-side :collapse="isCollapse"></nav-side>
        <el-container class="main">
           <nav-header v-model:collapse="isCollapse" ></nav-header>
            <el-main>
                <router-view></router-view>
            </el-main>
        </el-container>
    </el-container>
</template>

<script lang="ts" setup>
import { ref } from 'vue'
import navSide from './navSide/index.vue'
import navHeader from './navHeader/index.vue'
const isCollapse = ref(false)

</script>
<style lang="scss" scoped>
.main{
    display: flex;
    flex-direction: column;
    .el-header{
        display: flex;
        vertical-align: middle;
        // line-height: 60px;
        align-items: center;
    }
}
</style>